<template>
  <div
    class="h100 commonTableSty"
    ref="strategyTaskTableList"
  >
    <a-table
      :columns="columns"
      :components="tableComponents"
      :data-source="items"
      :pagination="false"
      :scroll="{ x:900,y: true }"
      row-key="id"
    >
      <template
        slot="verifyLevel"
        slot-scope="text"
      >
        <table-ellipsis :text="getVerifyLevelName(text)"></table-ellipsis>
      </template>
      <template
        slot="auditRoles"
        slot-scope="text,record"
      >
        <table-ellipsis :text="record.role"></table-ellipsis>
      </template>
      <template
        slot="verifyTime"
        slot-scope="text"
      >
        <table-ellipsis :text="$commonFun.getDateMinuteStr(text)"></table-ellipsis>
      </template>
      <template
        slot="auditUsers"
        slot-scope="text"
      >
        <table-ellipsis :text="text"></table-ellipsis>
      </template>
      <template
        slot="remark"
        slot-scope="text"
      >
        <table-ellipsis :text="text"></table-ellipsis>
      </template>
      <template
        slot="attachment"
        slot-scope="text,record"
      >
        <a-spin v-if="record.file" :spinning="downing">
          <a-icon slot="indicator" type="loading" style="font-size: 16px" spin />
          <a @click="downloadFile(record.file)">{{ $t('download') }}</a>
        </a-spin>
        <span v-else>-</span>
      </template>
      <template v-slot:operationResultName>
        <span v-if="operationResultName">{{ $t(operationResultName) }}</span>
        <span v-else>{{ $t('operationResult') }}</span>
      </template>
      <template
        slot="operationResult"
        slot-scope="text"
      >
        <table-ellipsis :text="verifyItemStatusDictCodeObj[text]"></table-ellipsis>
      </template>
    </a-table>
  </div>
</template>
<script>
import { taskVerifyDetailColumns } from './config/list'
import tableEllipsis from '@/components/Ellipsis/TableEllipsis'
import { mapState } from 'vuex'
import fileApi from '@/api/modules/system/fileUpload'
import { downloadBlobFile } from '@/utils/functions'
import tableDraggable from '@/utils/tableDraggable'
export default {
  components: {
    tableEllipsis
  },
  mixins: [],
  props: {
    items: {
      type: Array,
      default () {
        return []
      }
    },
    operationResultName: {
      type: String,
      default: ''
    }
  },
  computed: {
    ...mapState({
    }),
    commonColumns () {
      return this.columns.filter(item => !item.special)
    },
    verifyItemStatusDictCodeObj () {
      return this.$store.getters.getDictCodeObj('auditItemStatusDictCode')
    }
  },
  data () {
    return {
      columns: taskVerifyDetailColumns,
      downing: false,
      tableComponents: {}
    }
  },
  created () {
    this.getAuditItemStatus()
    this.tableComponents = tableDraggable(this.columns)
  },
  mounted () {
  },
  methods: {
    // 获取审核名称
    getVerifyLevelName (level) {
      if (typeof level === 'undefined') {
        return ''
      }
      const key = 'levelAudit' + level
      return this.$t(key)
    },
    getAuditItemStatus () {
      if (this.$store.state.dict.auditItemStatusDictCode.length === 0) {
        this.$store.dispatch('getAuditItemStatusDictCodeData')
      }
    },
    // 下载附件
    downloadFile (file) {
      this.downing = true
      fileApi.downloadFileToLocal({ id: file.id || 4 }).then((res) => {
        downloadBlobFile(res, file.name)
      }).finally(() => {
        this.downing = false
      })
    }
  }
}
</script>
